<%--
  Created by IntelliJ IDEA.
  User: joker
  Date: 2023/5/16
  Time: 10:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>CoolMeeting会议管理系统</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/styles/common.css"/>
    <script src="${pageContext.request.contextPath}/js/node_modules/jquery/dist/jquery.js"></script>
</head>
<body>
<div class="page-header">
    <div class="header-banner">
        <img src="${pageContext.request.contextPath}/images/header.png" alt="CoolMeeting"/>
    </div>
    <div class="header-title">
        欢迎访问Cool-Meeting会议管理系统
    </div>
    <div class="header-quicklink">
        欢迎您，<strong>${accountName}</strong>
        <a href="adminChangePassword.do">[修改密码]</a>
    </div>
</div>
<div class="page-body">
    <div class="page-sidebar">
        <div class="sidebar-menugroup">
            <div class="sidebar-grouptitle">人员管理</div>
            <ul class="sidebar-menu">
                <li class="sidebar-menuitem"><a href="department.do">部门管理</a></li>
                <li class="sidebar-menuitem"><a href="register.do">员工注册</a></li>
                <li class="sidebar-menuitem">
                    <a href="employeeApprove.do?accountName=${accountName}&password=${emp.password}" >注册审批</a></li>
                <li class="sidebar-menuitem"><a href="search.do">搜索员工</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="page-content">
    <div class="content-nav">
        人员管理 > 部门管理
    </div>
    <form method="post" action="addDept.do">
        <fieldset>
            <legend>添加部门</legend>
            部门名称:
            <input type="text" id="deptName" name="deptName" maxlength="20"/>
            <input type="submit" class="clickbutton" value="添加"/>
        </fieldset>
    </form>
    <table class="listtable">
        <caption>所有部门:</caption>
        <tr class="listheader">
            <th>部门编号</th>
            <th>部门名称</th>
            <th>操作</th>
        </tr>
        <c:forEach items="${deptList}" var="dept">
            <tr>
                <td>${dept.deptNo}</td>
                <td contenteditable="false" class="search-input">${dept.deptName}</td>
                <td>
                    <a id="${dept.deptNo}" class="clickbutton1">编辑</a>
                    <a id="${dept.deptNo}" class="clickbutton2">删除</a>
                </td>
            </tr>
        </c:forEach>
    </table>
</div>
<div class="page-footer">
    <hr/>
    更多问题，欢迎联系<a href="mailto:webmaster@eeg.com">管理员</a>
    <img src="${pageContext.request.contextPath}/images/footer.png" alt="CoolMeeting"/>
</div>
<script>
    let $clickbutton1 = $(".clickbutton1");
    let $search = $(".search-input");
    console.log($search);
    console.log($search.length);
    console.log($clickbutton1.length);
    let len = $clickbutton1.length;
    for (let i = 0; i < len; i++) {
        $clickbutton1[i].onclick = ()=>{
            console.log($clickbutton1[i].id);
            console.log($search[i].innerText);
            // $search[i].innerText = "能力部";
            $search.attr("contenteditable",true);
            // $.post("deptUp.do?deptNo="+$clickbutton1[i].id+"&deptName="+$search[i].innerText,
            //     (data)=>{
            //         $search[i].innerText = data;
            //
            //     }
            // )
        }
        $search[i].onclick = ()=>{
            $.post("deptUp.do?deptNo="+$clickbutton1[i].id+"&deptName="+$search[i].innerText,
                (data)=>{
                    $search[i].innerText = data;
                }
            )
            //$search.attr("contenteditable",false);
        }
        // $search.attr("contenteditable",false);
    }
    let $submit = $(":submit");
    $submit.click(()=>{
        alert($(":input").val()+" 部门添加成功！！！")
    });
</script>
</body>
</html>
